<template>
  <div class="self">
    <BusinessCard v-for="(item, index) of contactList" :info="item" :key="index" class="card" />
  </div>
</template>

<script>
import api from "@/api.js";
import BusinessCard from "@/components/BusinessCard.vue";
export default {
  data() {
    return {
      contactList: []
    };
  },
  components: {
    BusinessCard
  },
  created() {
    this.getContactList();
  },
  methods: {
    async getContactList() {
      const { data } = await api.getContactList();
      this.contactList = data;
      // window.console.log(data);
    }
  }
};
</script>

<style scoped>
.self {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  max-width: 1080px;
  margin: 0 auto;
}
</style>
